<template>
	<view>
		<view class="box_1" v-if="type == 'add'">
			您还可发布 {{ enable_addjob_num }} 条职位，升级套餐畅享更多会员权益
			<view class="right_txt" @click="handleTips">
				去了解
			</view>
		</view>
		<u-form ref="uForm">
			<view class="form_split_title">基本信息</view>
			<!-- 职位名称 -->
			<u-field placeholder-style="color:#757575;font-size:14px !important;" :clearable="false"
				v-model="basic.jobname" required name="jobname" label="职位名称" placeholder="请填写" class="reset_after" />
			<!-- 职位性质 -->
			<view class="form-line u-border-bottom form_choose reset_after" @click="showPickerNature = true">
				<view class="form-field">
					<view class="label">
						职位性质
					</view>
					<view :class="nature_text  ? 'text' : 'text ac'">
						{{nature_text ? nature_text : '请选择'}}
					</view>
				</view>
				<u-icon class="arrow-icon" name="arrow-right"></u-icon>
			</view>


			<!-- <view style="position: fixed;width: 100vw;height: 100vh;z-index: 100;" v-if="showPickerNature"> -->
			<u-action-sheet v-model="showPickerNature" :list="columnsNature" :cancel-btn="false"
				@click="onConfirmNature" />
			<!-- </view> -->

			<!-- 职位类别 -->
			<view class="form-line u-border-bottom form_choose reset_after"
				@click="showPickerJobCategory = !showPickerJobCategory">
				<view class="form-field">
					<view class="label">
						职位类别
					</view>
					<view :class="basic.categoryName ? 'text' : 'text ac'">
						{{basic.categoryName ? basic.categoryName : '请选择'}}
					</view>
				</view>
				<u-icon class="arrow-icon" name="arrow-right"></u-icon>
			</view>
			<u-popup v-model="showPickerJobCategory" mode="bottom" height="900rpx" ref="dropCategory">
				<JobCategoryFilter :categories="[basic.category1, basic.category2, basic.category3]" :type="false"
					:all="false" @doSelect="doSelectCategory">
				</JobCategoryFilter>
			</u-popup>
			<!-- 经验要求 学历要求 薪资待遇-->
			<view class="box_2">
				<view class="item" @click="showPickerExperience = true">
					<view class="tx1">经验要求</view>
					<view class="tx2">{{ experience_text }}</view>
				</view>
				<u-picker v-model="showPickerExperience" mode="selector" :default-selector="[experienceDefaultIndex]"
					:range="columnsExperience" range-key="text" @confirm="onConfirmExperience"
					@cancel="showPickerExperience = false" />
				<view class="item" @click="showPickerEducation = true">
					<view class="tx1">学历要求</view>
					<view class="tx2">{{ education_text }}</view>
				</view>
				<u-picker v-model="showPickerEducation" mode="selector" :range="columnsEducation" range-key="text"
					:default-selector="[educationDefaultIndex]" @confirm="onConfirmEducation"
					@cancel="showPickerEducation = false" />
				<view class="item" @click="showPickerWage = true">
					<view class="tx1">薪资待遇</view>
					<view class="tx2">{{ wage_text }}</view>
				</view>
				<u-select v-model="showPickerWage" mode="mutil-column-auto" :list="columnsWage"
					@confirm="onConfirmWage"></u-select>

			</view>
			<!-- 招聘人数 -->
			<u-field placeholder-style="color:#757575;font-size:14px !important;"
				v-if="field_rule.basic.amount.is_display == 1"
				:required="field_rule.basic.amount.is_require == 1 ? true : false" v-model="basic.amount" name="amount"
				:label="field_rule.basic.amount.field_cn" placeholder="请填写招聘人数" class="reset_after"
				:clearable="false" />
			<!-- 工作地区 -->
			<view class="form-line u-border-bottom form_choose reset_after"
				@click="showPickerDistrict = !showPickerDistrict">
				<view class="form-field">
					<view class="label">
						工作地区
					</view>
					<view :class="district_texte  ? 'text' : 'text ac'">
						{{district_text ? district_text : '请选择'}}
					</view>
				</view>
				<u-icon class="arrow-icon" name="arrow-right"></u-icon>
			</view>
			<u-mask :show="showPickerDistrict" />
			<u-popup class="districtFilter" v-model="showPickerDistrict" mode="bottom" ref="dropDistrict" :mask="false"
				height="900rpx">
				<DistrictFilter :districts="[basic.district1, basic.district2, basic.district3]" :type="false"
					:all="false" @doSelect="doSelectDistrict">
				</DistrictFilter>
			</u-popup>
			<!-- 详细地址 -->
			<view class="box_3">
				<u-field placeholder-style="color:#757575;font-size:14px !important;" :border-bottom="false"
					v-model="basic.address" name="address" label=" " placeholder="详细地址" class="reset_after" />
				<!-- <view class="tag" @click="handlerShowMap">标注</view> -->
			</view>
			<!-- 职位描述 -->
			<u-field required disabled label="职位描述" class="reset_after no_border" />
			<view class="box_4">
				<!-- 描述 -->
				<view v-if="isViewTextarea" @click="handleHideTextarea"
					:class="isViewTextarea && basic.content== '' ? 'textarea textarea-color' : 'textarea'">
					{{basic.content ? basic.content : '请输入详细的职位描述'}}
				</view>
				<textarea maxlength="-1" class="textarea2" v-if="!isViewTextarea" :value="basic.content"
					:focus="isFocus" placeholder="请输入详细的职位描述" @blur="handleHideTextarea" @input="handleInput">
				</textarea>
				<u-tag type="primary" class="tpl_tag" size="medium" v-for="(item, index) in tpllist" :key="index"
					@click="basic.content = item.content">
					{{ item.title }}
				</u-tag>
			</view>
			<view class="form_split_title" v-if="field_rule.basic.tag.is_display == 1 ||
				field_rule.basic.department.is_display == 1 ||
				field_rule.basic.age.is_display == 1 ||
				field_rule.basic.custom_field_1.is_display == 1 ||
				field_rule.basic.custom_field_2.is_display == 1 ||
				field_rule.basic.custom_field_3.is_display == 1
			">
				其他信息
			</view>
			<!-- 岗位福利 -->
			<view v-if="field_rule.basic.tag.is_display == 1" class="form-line u-border-bottom form_choose reset_after"
				@click="handlerShowTag">
				<view class="form-field">
					<view class="label" :class="field_rule.basic.tag.is_require == 1 ? '' : 'no'">
						岗位福利
					</view>
					<view :class="tag_text ? 'text' : 'text ac'">
						{{tag_text ? tag_text : '请选择'}}
					</view>
				</view>
				<u-icon class="arrow-icon" name="arrow-right"></u-icon>
			</view>
			<view :class="showTag ? 'addInvitation ac' : 'addInvitation'">
				<JobTag ref="jobTag" title="岗位福利" :tag_arr="basic.tag" @handlerCloseTag="handlerCloseTag">
				</JobTag>
			</view>
			<!-- 所属部门 -->
			<u-field placeholder-style="color:#757575;font-size:14px !important;"
				v-if="field_rule.basic.department.is_display == 1"
				:required="field_rule.basic.department.is_require == 1 ? true : false" v-model="basic.department"
				name="department" :label="field_rule.basic.department.field_cn" placeholder="请填写" class="reset_after"
				:clearable="false" />
			<!-- 年龄 -->
			<view v-if="field_rule.basic.age.is_display == 1" class="form-line u-border-bottom form_choose reset_after"
				@click="showPickerAge = true">
				<view class="form-field">
					<view class="label" :class="field_rule.basic.age.is_require == 1 ? '' : 'no'">
						{{field_rule.basic.age.field_cn}}
					</view>
					<view :class="age_text != '请选择' ? 'text' : 'text ac'">
						{{age_text ? age_text : '请选择'}}
					</view>
				</view>
				<u-icon class="arrow-icon" name="arrow-right"></u-icon>
			</view>
			<u-select v-model="showPickerAge" mode="mutil-column-auto" :list="columnsAge"
				@confirm="onConfirmAge"></u-select>
			<!-- 自定义1 -->
			<u-field placeholder-style="color:#757575;font-size:14px !important;"
				v-if="field_rule.basic.custom_field_1.is_display == 1"
				:required="field_rule.basic.custom_field_1.is_require == 1 ? true : false"
				v-model="basic.custom_field_1" name="custom_field_1" :label="field_rule.basic.custom_field_1.field_cn"
				placeholder="请填写" class="reset_after" :clearable="false" />
			<!-- 自定义2 -->
			<u-field placeholder-style="color:#757575;font-size:14px !important;"
				v-if="field_rule.basic.custom_field_2.is_display == 1"
				:required="field_rule.basic.custom_field_2.is_require == 1 ? true : false  "
				v-model="basic.custom_field_2" name="custom_field_2" :label="field_rule.basic.custom_field_2.field_cn"
				placeholder="请填写" class="reset_after" :clearable="false" />
			<!-- 自定义3 -->
			<u-field placeholder-style="color:#757575;font-size:14px !important;"
				v-if="field_rule.basic.custom_field_3.is_display == 1"
				:required=" field_rule.basic.custom_field_3.is_require == 1 ? true : false "
				v-model="basic.custom_field_3" name="custom_field_3" :label="field_rule.basic.custom_field_3.field_cn"
				placeholder="请填写" class="reset_after" :clearable="false" />
			<view class="form_split_title">联系方式</view>
			<!-- 联系方式 -->
			<view class="form-line u-border-bottom form_choose reset_after" @click="showPickerContactSource = true">
				<view class="form-field">
					<view class="label no">
						联系方式
					</view>
					<view :class="contact_source_text ? 'text' : 'text ac'">
						{{contact_source_text ? contact_source_text : '请选择'}}
					</view>
				</view>
				<u-icon class="arrow-icon" name="arrow-right"></u-icon>
			</view>
			<u-action-sheet v-model="showPickerContactSource" :list="columnsContactSource" border-radius="30rpx"
				:cancel-btn="false" @click="onConfirmContactSource" />
			<view v-if="contact.use_company_contact == 0">
				<!-- 联系人 -->
				<u-field placeholder-style="color:#757575;font-size:14px !important;" :clearable="false"
					v-model="contact.contact" required name="contact" label="联系人" placeholder="请填写"
					class="reset_after" />
				<!-- 联系电话 -->
				<u-field placeholder-style="color:#757575;font-size:14px !important;" :clearable="false"
					v-model="contact.mobile" required name="mobile" label="联系电话" placeholder="请填写" class="reset_after"
					@input="hanlderMobile" />
				<!-- 联系微信 -->
				<!-- <u-field
					:clearable="false"
					v-if="field_rule.contact.weixin.is_display == 1"
					:required="field_rule.contact.weixin.is_require == 1 ? true : false" 
					v-model="contact.weixin"
					name="weixin" 
					:label="field_rule.contact.weixin.field_cn" 
					placeholder="请填写" 
					class="reset_after"
					@input="hanlderWeixin" 
				/> -->
				<!-- <view class="for_btn">
					<view class="sync_phone">
						<u-checkbox 
							shape="circle"
							v-model="weixin_sync_mobile" 
							icon-size="32rpx" 
							@change="handlerSync"
						>
							同手机号
						</u-checkbox>
					</view>
				</view> -->
				<!-- 联系固话 -->
				<u-field placeholder-style="color:#757575;font-size:14px !important;" :clearable="false"
					v-if="field_rule.contact.telephone.is_display == 1"
					:required=" field_rule.contact.telephone.is_require == 1 ? true : false "
					v-model="contact.telephone" name="telephone" :label="field_rule.contact.telephone.field_cn"
					placeholder="请填写" class="reset_after" />
				<!-- 联系邮箱 -->
				<u-field placeholder-style="color:#757575;font-size:14px !important;" :clearable="false"
					v-if="field_rule.contact.email.is_display == 1"
					:required="field_rule.contact.email.is_require == 1 ? true : false" v-model="contact.email"
					name="email" :label="field_rule.contact.email.field_cn" placeholder="请填写" class="reset_after" />
				<!-- 联系qq -->
				<u-field placeholder-style="color:#757575;font-size:14px !important;" :clearable="false"
					v-if="field_rule.contact.qq.is_display == 1"
					:required="field_rule.contact.qq.is_require == 1 ? true : false" v-model="contact.qq" name="qq"
					:label="field_rule.contact.qq.field_cn" placeholder="请填写" class="reset_after" />
			</view>

			<view class="form_split_10"></view>
			<view class="form_flex">
				<view class="concact_form">
					<u-field label="联系方式保密" disabled placeholder="（不想受到骚扰）" class="reset_after" />
				</view>
				<view class="for_btn">
					<u-switch class="self_switch" v-model="contactHidden" size="36" active-color="#45db5e" />
				</view>
			</view>
			<view class="form_split_10"></view>
			<view style="padding: 24rpx 34rpx; ">
				<u-button shape="circle" type="primary" @click="onSubmit">
					{{ btnText }}
				</u-button>
			</view>
		</u-form>
		<u-toast ref="uToast" />
		<CustomerModal ref="CustomerModal"></CustomerModal>
	</view>
</template>

<script>
	// import Mapset from '@/components/Mapset'
	import JobCategoryFilter from '@/components/JobCategoryFilter'
	import DistrictFilter from '@/components/DistrictFilter'
	import JobTag from './CompanyTag.vue'
	import http from '@/utils/http'
	import api from '@/api'
	import {
		DbToGc
	} from '@/utils/map.js'
	import {
		mapState
	} from 'vuex'
	import {
		CustomerModal
	} from '@/components/CustomerModal.vue'
	export default {
		name: 'JobForm',
		props: ['enable_addjob_num', 'type'],
		components: {
			JobTag,
			JobCategoryFilter,
			DistrictFilter,
			// Mapset,
			CustomerModal
		},
		data() {
			return {
				isFocus: false,
				defPickerWage: true,
				isViewTextarea: true,
				showPickerNature: false,
				btnText: '发布职位',
				field_rule: {
					basic: {
						department: {},
						age: {},
						tag: {},
						amount: {},
						negotiable: {},
						custom_field_1: {},
						custom_field_2: {},
						custom_field_3: {}
					},
					contact: {
						weixin: {},
						telephone: {},
						qq: {},
						email: {}
					}
				},
				basicContent: '',
				basic: {
					id: 0,
					jobname: '',
					nature: 1,
					category1: 0,
					category2: 0,
					category3: 0,
					categoryName: '',
					experience: 0,
					education: 0,
					minwage: 0,
					maxwage: 0,
					negotiable: 0,
					amount: 0,
					district1: 0,
					district2: 0,
					district3: 0,
					districtName: '',
					content: '',
					tag: [],
					department: '',
					minage: 0,
					maxage: 0,
					age_na: 0,
					map_lat: 0,
					map_lng: 0,
					map_zoom: 0,
					address: '',
					custom_field_1: '',
					custom_field_2: '',
					custom_field_3: ''
				},
				contact: {
					use_company_contact: 1,
					is_display: 1,
					contact: '',
					mobile: '',
					weixin: '',
					telephone: '',
					email: '',
					qq: ''
				},
				showPickerJobCategory: false,
				showPickerExperience: false,
				showPickerEducation: false,
				showPickerAge: false,
				showPickerDistrict: false,
				showPickerWage: false,
				showTag: false,
				showPickerContactSource: false,
				experience_text: '经验不限',
				education_text: '学历不限',
				age_text: '请选择',
				district_text: '请选择',
				tag_text: '',
				wage_text: '请选择',
				contact_source_text: '使用企业资料联系方式',
				columnsContactSource: [{
						id: 1,
						text: '使用企业资料联系方式'
					},
					{
						id: 0,
						text: '使用其他联系方式'
					}
				],
				contactHidden: false,
				weixin_sync_mobile: false,
				wageStart: this.$store.state.minWage,
				// 修改
				wageDefaultIndex: [0, 0],
				// wageDefaultIndex1: 0,
				// wageDefaultIndex2: 0,
				ageStart: this.$store.state.minAge,
				ageDefaultIndex1: 0,
				ageDefaultIndex2: 0,
				experienceDefaultIndex: 0,
				educationDefaultIndex: 0,
				tpllist: [],
				nature_text: '全职',
				regularMobile: /^13[0-9]{9}$|14[0-9]{9}$|15[0-9]{9}$|18[0-9]{9}$|17[0-9]{9}$|16[0-9]{9}$|19[0-9]{9}$/, // 手机验证
				regularEmail: /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/, // 邮箱验证
			}
		},
		created() {
			this.$store.dispatch('getClassify', 'jobcategory')
			this.$store.dispatch('getClassify', 'education')
			this.$store.dispatch('getClassify', 'citycategory')
			this.$store.dispatch('getClassify', 'experience')
			this.$store.dispatch('getClassify', 'jobNature')
			this.$store.dispatch('getClassifyWage')
			this.$store.dispatch('getClassifyAge')
		},
		computed: {
			columnsEducation() {
				let arr = [{
					id: '0',
					text: '学历不限'
				}]
				arr = arr.concat(this.$store.state.classifyEdu)
				return arr
			},
			columnsExperience() {
				let arr = [{
					id: '0',
					text: '经验不限'
				}]
				arr = arr.concat(this.$store.state.classifyExperience)
				return arr
			},
			columnsNature() {
				let arr = []
				if (!this.$store.state.classifyJobNature) return
				this.$store.state.classifyJobNature.forEach(element => {
					arr.push({
						id: element.id,
						name: element.text,
						text: element.text
					})
				})
				return arr
			},
			columnsWage() {
				return this.wage(this.field_rule.basic.negotiable.is_display == 1)
			},
			columnsAge() {
				// defaultIndex: this.ageDefaultIndex1 defaultIndex: this.ageDefaultIndex2
				// return [
				// 	Object.keys(this.$store.state.classifyAge),
				// 	this.$store.state.classifyAge[this.ageStart]
				// ]
				return this.age()
			},
			...mapState({
				storeCategory: state => state.classifyJobCategory
			})
		},
		watch: {
			storeCategory(val) {
				if (val.length > 0) {
					this.restoreJobCategory()
				}
			}
		},
		methods: {
			handleTips() {
				this.$refs.CustomerModal.getCustomer()
			},
			wage(res) {
				let minWage = this.$store.state.minWage
				const maxWage = this.$store.state.maxWage
				let listArray = []
				if (res) {
					listArray = [{
						label: '面议',
						value: '面议',
						children: []
					}]
				} else {
					listArray = []
				}
				let a = 0
				let b = 0
				for (let i = 0; i < 50; i++) {
					if (minWage < maxWage) {
						a += 500
						minWage = a
						if (a !== maxWage) {
							listArray.push({
								label: a,
								value: a,
								children: []
							})
						}
						for (let j = 0; j < listArray.length; j++) {
							b = a
							b += 500
							if (listArray[j].value == '面议') {
								listArray[j].children = [{
									label: '',
									value: ''
								}]
							} else if (b <= maxWage) {
								listArray[j].children.push({
									label: b,
									value: b
								})
							}
						}
					}
				}
				return listArray
			},
			age() {
				let minAge = this.$store.state.minAge
				const maxAge = this.$store.state.maxAge
				const listArray = [{
					label: '不限',
					value: '不限',
					children: []
				}]
				let a = minAge
				let b = maxAge
				for (let i = 0; i < 50; i++) {
					if (minAge < maxAge) {
						a += 1
						minAge = a
						if (a !== maxAge) {
							listArray.push({
								label: a,
								value: a,
								children: []
							})
						}
						for (let j = 0; j < listArray.length; j++) {
							b = a
							b += 1
							if (listArray[j].value == '不限') {
								listArray[j].children = [{
									label: '',
									value: ''
								}]
							} else if (b <= maxAge) {
								listArray[j].children.push({
									label: b,
									value: b
								})
							}
						}
					}
				}
				return listArray
			},
			/*
				处理点击 TextareaView
			*/
			handleHideTextarea() {
				if (this.basicContent != '') {
					this.basic.content = this.basicContent
				}
				this.isFocus = !this.isFocus
				this.isViewTextarea = !this.isViewTextarea
			},
			handleInput(e) {
				this.basicContent = e.detail.value
			},
			/**
			 * 修改职位恢复函数
			 * @data (Object)
			 * */
			restoreCondition(data) {
				let restoreBasic = data.basic
				let restoreContact = data.contact
				this.basicContent = data.basic.content
				// 恢复职位类别汉字
				this.basic.categoryName = restoreBasic.category_text
				// 恢复经验
				this.experienceDefaultIndex = this.columnsExperience.findIndex(
					item => parseInt(item.id) === parseInt(this.basic.experience)
				)
				this.experience_text = restoreBasic.experience_text == '' ? '经验不限' : restoreBasic.experience_text
				// 恢复性质
				this.nature_text = restoreBasic.nature_text == '' ? '全职' : restoreBasic.nature_text
				// 恢复学历
				this.educationDefaultIndex = this.columnsEducation.findIndex(
					item => parseInt(item.id) === parseInt(this.basic.education)
				)
				this.education_text = restoreBasic.education_text == '' ? '学历不限' : restoreBasic.education_text
				// 恢复薪资
				let _this = this
				let pickerWage = this.$store.state.classifyWage
				Object.keys(pickerWage).forEach(function(key, index) {
					if (parseInt(key) === parseInt(_this.basic.minwage)) {
						// 修改
						let index2 = pickerWage[key].findIndex(
							item => parseInt(item) === _this.basic.maxwage
						)
						_this.wageDefaultIndex = [index, index2]
						// _this.wageDefaultIndex1 = index
						_this.wageStart = _this.basic.minwage
						// _this.wageDefaultIndex2 = pickerWage[key].findIndex(
						// 	item => parseInt(item) === _this.basic.maxwage
						// )
					}
				})
				this.wage_text = restoreBasic.wage_text
				// 恢复地区汉字
				this.district_text = restoreBasic.district_text
				// 恢复岗位福利
				this.tag_text = restoreBasic.tag_text_arr.join(',')
				// 恢复年龄要求
				let pickerAge = this.$store.state.classifyAge
				Object.keys(pickerAge).forEach(function(key, index) {
					if (parseInt(key) === parseInt(_this.basic.minage)) {
						_this.ageDefaultIndex1 = index
						_this.ageStart = _this.basic.minage
						_this.ageDefaultIndex2 = pickerAge[key].findIndex(
							item => parseInt(item) === _this.basic.maxage
						)
					}
				})
				this.age_text = restoreBasic.age_text + '岁'
				// 联系方式是否保密
				this.contactHidden = parseInt(restoreContact.is_display) === 0
				this.weixin_sync_mobile = this.contact.weixin === this.contact.mobile
				this.btnText = '保存职位'
				// 恢复联系方式
				this.contact.use_company_contact = restoreContact.use_company_contact
				let contactItem = this.columnsContactSource.filter(item => item.id === this.contact.use_company_contact)[0]
				this.contact_source_text = contactItem.text
			},
			// 
			restoreJobCategory() {
				if (this.basic.category1) {
					// 恢复选中项对应的汉字
					let storeCategory = this.storeCategory
					let selectText = []
					let topItem = storeCategory.filter(
						item => parseInt(item.id) === parseInt(this.basic.category1)
					)[0]
					selectText.push(topItem.text)
					if (topItem.children.length) {
						if (parseInt(this.basic.category2)) {
							let secondItem = topItem.children.filter(
								item => parseInt(item.id) === parseInt(this.basic.category2)
							)[0]
							selectText.push(secondItem.text)
							if (secondItem.children.length) {
								if (parseInt(this.basic.category3)) {
									let lowestItem = secondItem.children.filter(
										item => parseInt(item.id) === parseInt(this.basic.category3)
									)[0]
									selectText.push(lowestItem.text)
								} else {
									selectText.push(`全${selectText[selectText.length - 1]}`)
								}
							}
						} else {
							// 相当于不限
							selectText.push(`全${selectText[selectText.length - 1]}`)
						}
					}
					this.basic.categoryName = selectText[selectText.length - 1]
				}
			},
			/**
			 * 职位分类组件回调函数
			 * @data (Array) 返回职位id及职位名称
			 * */
			doSelectCategory(data) {
				this.basic.category1 = data[0]
				this.basic.category2 = data[1]
				this.basic.category3 = data[2]
				this.basic.categoryName = data[3]
				this.showPickerJobCategory = !this.showPickerJobCategory
				let pid = this.basic.category3 != 0 ? this.basic.category3 : (this.basic.category2 != 0 ? this.basic
					.category2 : (this.basic.category1 != 0 ? this.basic.category1 : 0))
				http
					.get(api.categoryjob_template_list, {
						pid
					})
					.then(res => {
						this.tpllist = res.data.data
					})
					.catch(() => {})
			},
			/**
			 * 地区组件回调函数
			 * @data (Array) 选择城市id及城市名称
			 * */
			doSelectDistrict(data) {
				this.basic.district1 = data[0]
				this.basic.district2 = data[1]
				this.basic.district3 = data[2]
				this.district_text = data[3]
				this.showPickerDistrict = !this.showPickerDistrict
			},
			/**
			 * 联系电话
			 * @val （String） 当前input 输入内容
			 * */
			hanlderMobile(val) {
				if (this.weixin_sync_mobile === true) {
					this.contact.weixin = val
				}
			},
			// 填写微信
			hanlderWeixin() {
				if (this.contact.weixin !== this.contact.mobile) {
					this.weixin_sync_mobile = false
				} else {
					this.weixin_sync_mobile = true
				}
			},
			// 同手机号
			handlerSync() {
				if (!this.weixin_sync_mobile) {
					this.contact.weixin = this.contact.mobile
				}
			},
			/**
			 * 经验要求
			 * @value (Array) 返回当前picker组件选中元素的下标
			 * */
			onConfirmExperience(value) {
				this.basic.experience = this.columnsExperience[value].id
				this.experience_text = this.columnsExperience[value].text
				this.showPickerExperience = !this.showPickerExperience
			},
			/**
			 * 学历要求
			 * @value (Array) 返回当前picker组件选中元素的下标
			 * */
			onConfirmEducation(value) {
				this.basic.education = this.columnsEducation[value].id
				this.education_text = this.columnsEducation[value].text
				this.showPickerEducation = !this.showPickerEducation
			},
			/**
			 * 设置年龄
			 * @values (Array) 返回当前picker组件选中元素的下标
			 * */
			onConfirmAge(values) {
				if (values[0] == 0 && values.length == 1) {
					values = [values[0], 0]
				}
				this.basic.minage = this.columnsAge[0][values[0]]
				this.basic.maxage = this.columnsAge[1][values[1]]
				this.age_text = `${this.columnsAge[0][values[0]]}-${this.columnsAge[1][values[1]]}岁`
				this.showPickerAge = !this.showPickerAge
			},
			/**
			 * 薪资待遇
			 * */
			onConfirmWage(values) {
				// 修改
				if (values[0].label == '面议') {
					this.basic.negotiable = 1
					this.basic.minwage = 0
					this.basic.maxwage = 0
					this.wage_text = '面议'
				} else {
					this.basic.negotiable = 0
					this.basic.minwage = parseInt(values[0].label)
					this.basic.maxwage = parseInt(values[1].label)
					this.wage_text = `${parseInt(values[0].label)}-${parseInt(values[1].label)}元`
				}
			},
			onConfirmAge(values) {
				if (values[0].label == '不限') {
					this.basic.age_na = 1
					this.basic.minage = 0
					this.basic.maxage = 0
					this.age_text = '不限'
				} else {
					this.basic.age_na = 0
					this.basic.minage = parseInt(values[0].label)
					this.basic.maxage = parseInt(values[1].label)
					this.age_text = `${parseInt(values[0].label)}-${parseInt(values[1].label)}岁`
				}
			},
			/**
			 * 选择联系方式
			 * @index (Number) 返回当前选中项的下标
			 * */
			onConfirmContactSource(index) {
				this.contact.use_company_contact = this.columnsContactSource[index].id
				this.contact_source_text = this.columnsContactSource[index].text
				this.showPickerContactSource = !this.showPickerContactSource
			},
			/**
			 * 职位性质
			 * @value (Number) 返回当前选中职位性质下标
			 * */
			onConfirmNature(value) {
				this.basic.nature = this.columnsNature[value].id
				this.nature_text = this.columnsNature[value].name
				this.showPickerNature = !this.showPickerNature
			},
			handlerShowTag() {
				this.showTag = true
				this.$nextTick(() => {
					// this.$refs.jobTag.initCB()
				})
			},
			/**
			 * 岗位福利
			 * @tagInfo (Object) 返回选中的福利标签id(tagIdArr)及文本(tagTextArr)
			 * */
			handlerCloseTag(tagInfo) {
				this.showTag = false
				if (tagInfo === undefined) {
					return false
				}
				this.basic.tag = tagInfo.tagIdArr
				this.tag_text =
					tagInfo.tagTextArr.length > 0 ? tagInfo.tagTextArr.join(',') : ''
			},
			// 年龄不限
			handlerAgeNa() {
				this.basic.age_na = 1
				this.basic.minage = 0
				this.basic.maxage = 0
				this.age_text = '不限'
				this.showPickerAge = !this.showPickerAge
			},
			/**
			 * 年龄级联
			 * @data (Object) 返回picker组件列(column)和下标(index)
			 * */
			onChangeAge(data) {
				let {
					column,
					index
				} = data
				if (!column) {
					let values = parseInt(this.columnsAge[column][index])
					this.$set(this.columnsAge, 1, this.$store.state.classifyAge[values])
					this.$forceUpdate();
				}
			},
			// 提交保存
			onSubmit() {
				this.basic.content = this.basicContent
				this.contact.is_display = this.contactHidden == 1 ? 0 : 1
				// 职位名称
				if (this.basic.jobname == '') {
					this.$refs.uToast.show({
						title: '请填写职位名称'
					})
					return false
				}

				// 职位性质
				if (this.basic.nature == '') {
					this.$refs.uToast.show({
						title: '请选择职位性质'
					})
					return false
				}

				//职位类别
				if (this.basic.categoryName == '') {
					this.$refs.uToast.show({
						title: '请选择职位类别'
					})
					return false
				}

				//薪资待遇
				if (this.field_rule.basic.negotiable.is_require == 1) {
					if (this.wage_text == '请选择') {
						this.$refs.uToast.show({
							title: '请填写薪资'
						})
						return false
					}
				}

				// 招聘人数
				if (this.field_rule.basic.amount.is_require == 1) {
					if (this.basic.amount == '') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.amount.field_cn
						})
						return false
					}
				}

				// 工作地区
				if (this.district_text == '请选择') {
					this.$refs.uToast.show({
						title: '请选择工作地区'
					})
					return false
				}

				// 职位描述
				if (this.basic.content == '') {
					this.$refs.uToast.show({
						title: '请填写职位描述'
					})
					return false
				}

				// 其他信息
				// 岗位福利
				if (this.field_rule.basic.tag.is_require == 1) {
					if (this.tag_text == '') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.tag.field_cn
						})
						return false
					}
				}
				// 部门
				if (this.field_rule.basic.department.is_require == 1) {
					if (this.basic.department == '') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.department.field_cn
						})
						return false
					}
				}

				// 年龄
				if (this.field_rule.basic.age.is_require == 1) {
					if (this.age_text == '请选择') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.age.field_cn
						})
						return false
					}
				}
				// 政治面貌
				if (this.field_rule.basic.custom_field_1.is_require == 1) {
					if (this.basic.custom_field_1 == '') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.custom_field_1.field_cn
						})
						return false
					}
				}
				// 自定义
				if (this.field_rule.basic.custom_field_2.is_require == 1) {
					if (this.basic.custom_field_2 == '') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.custom_field_2.field_cn
						})
						return false
					}
				}
				//证书要求
				if (this.field_rule.basic.custom_field_3.is_require == 1) {
					if (this.basic.custom_field_3 == '') {
						this.$refs.uToast.show({
							title: '请填写' + this.field_rule.basic.custom_field_3.field_cn
						})
						return false
					}
				}
				if (this.contact.use_company_contact == 0) {
					// 联系人
					if (this.contact.contact == '') {
						this.$refs.uToast.show({
							title: '请填写联系人'
						})
						return false
					}
					// 联系电话
					if (!this.regularMobile.test(this.contact.mobile)) {
						this.$refs.uToast.show({
							title: '请填写联系电话'
						})
						return false
					}

					// 联系方式
					// if(this.field_rule.contact.weixin.is_require == 1){
					// 	if(this.contact.weixin == ''){
					// 		this.$refs.uToast.show({
					// 			title: '请填写' + this.field_rule.contact.weixin.field_cn + '或输入正确的电话'
					// 		})
					// 		return false
					// 	}
					// }

					if (this.field_rule.contact.telephone.is_require == 1) {
						if (this.contact.telephone == '') {
							this.$refs.uToast.show({
								title: '请填写' + this.field_rule.contact.telephone.field_cn
							})
							return false
						}
					}

					if (this.field_rule.contact.email.is_require == 1) {
						if (!this.regularEmail.test(this.contact.email)) {
							this.$refs.uToast.show({
								title: '请填写' + this.field_rule.contact.email.field_cn
							})
							return false
						}
					}

					if (this.field_rule.contact.qq.is_require == 1) {
						if (this.contact.qq == '') {
							this.$refs.uToast.show({
								title: '请填写' + this.field_rule.contact.qq.field_cn
							})
							return false
						}
					}
				}
				this.$emit('submit', {
					basic: this.basic,
					contact: this.contact
				})
				setTimeout(() => {
					this.basic.content = ''
					this.basicContent = ''
				}, 2000)
			},
			// 地图标注 
			handlerShowMap() {
				var _this = this
				if (_this.basic.map_lat > 0 && _this.basic.map_lng > 0) {
					var res = DbToGc(_this.basic.map_lat, _this.basic.map_lng)
					openMap(res.lat, res.lng)
				} else {
					uni.getLocation({
						type: 'gcj02',
						success: function(res) {
							openMap(res.latitude, res.longitude)
						}
					})
				}

				function openMap(map_lat, map_lng) {
					console.log(map_lat, map_lng, '打开地图')
					uni.chooseLocation({
						latitude: map_lat,
						longitude: map_lng,
						keyword: '',
						success(res) {
							_this.basic.map_lat = res.latitude
							_this.basic.map_lng = res.longitude
							_this.basic.address = res.address
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	// 定义进入前与离开后状态
	.name-enter,
	.name-leave-to {
		transform: translateY(100vh);
	}

	// 定义离开前与进入后状态
	.name-leave,
	.name-enter-to {
		transform: translateY(13vh);
	}

	// 定义进出过程
	.name-enter-active,
	.name-leave-active {
		transition: all .5s
	}

	.picker-title {
		position: absolute;
		left: 50%;
		z-index: -1;
		font-size: 26rpx;
		opacity: 0;
		transform: translate(-50%, 18vh);
		transition: all 0.25s linear 3s;
	}

	.picker-title-ac {
		opacity: 1;
		z-index: 18000;
	}

	.picker-title-ac2 {
		opacity: 0;
		z-index: -1;
	}

	.box_4 {
		width: 100%;
		background-color: #ffffff;
		position: relative;
		// padding: 0 40rpx 40rpx 40rpx;
	}

	.box_3 {
		.tag {
			position: absolute;
			right: 34rpx;
			top: 0;
			padding: 30rpx 36rpx 30rpx 0;
			font-size: 28rpx;
			color: #666666;
			background-image: url(../static/img/location_ico_blue.png);
			background-position: right center;
			background-repeat: no-repeat;
			background-size: 28rpx;
		}

		.text {
			&::placeholder {
				color: #c9c9c9;
			}

			font-size: 28rpx;
			border: 0;
			width: 360rpx;
			height: 80rpx;
			position: absolute;
			left: 238rpx;
			top: 10rpx;
			color: #333333;
		}

		&::after {
			position: absolute;
			left: 0;
			box-sizing: border-box;
			content: " ";
			pointer-events: none;
			right: 0;
			bottom: 0;
			transform: scaleY(0.5);
			border-bottom: 2rpx solid #ebebeb;
		}

		width: 100%;
		height: 100rpx;
		background-color: #ffffff;
		position: relative;
		padding: 0 136rpx 0 0;
	}

	.box_2 {
		.item {
			&:not(:last-child)::after {
				position: absolute;
				right: 0;
				top: 40rpx;
				height: 80rpx;
				border-right: 2rpx solid #e2e2e2;
				content: " ";
			}

			.tx2 {
				padding: 10rpx 0 35rpx;
				font-size: 28rpx;
				color: #333333;
			}

			.tx1 {
				padding-top: 35rpx;
				font-size: 24rpx;
				color: #666666;
			}

			flex: 1;
			text-align: center;
			position: relative;
		}

		&::after {
			position: absolute;
			left: 0;
			box-sizing: border-box;
			content: " ";
			pointer-events: none;
			right: 0;
			bottom: 0;
			transform: scaleY(0.5);
			border-bottom: 2rpx solid #ebebeb;
		}

		width: 100%;
		display: flex;
		background-color: #ffffff;
		position: relative;
	}

	.sync_phone {
		position: absolute;
		right: 24rpx;
		top: -100rpx;
		font-size: 28rpx;
		color: #515151;
		padding: 30rpx 0;
		line-height: 48rpx;
		z-index: 20;
	}

	.self_switch {
		// position: absolute;
		// right: 30rpx;
		// top: -70rpx;
		// z-index: 30;
	}

	.box_1 {
		width: 100%;
		font-size: 24rpx;
		color: #ff6600;
		position: relative;
		padding: 21rpx 0 21rpx 66rpx;
		background-image: $remind_ico;
		background-color: #fffbeb;
		background-position: 26rpx center;
		background-repeat: no-repeat;
		background-size: 30rpx;

		.right_txt {
			position: absolute;
			right: 0;
			top: 0;
			font-size: 24rpx;
			color: #1787fb;
			padding: 21rpx 34rpx;
		}
	}

	.tpl_tag {
		margin-right: 20rpx;
	}

	.addInvitation {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		transform: translateY(-100%);
		z-index: 10052;
		background-color: #fff;
		transition: all .5s;

		&.ac {
			transform: translateY(0%);
		}
	}

	.form_flex {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;

		.concact_form {
			width: 80%;
		}

		.for_btn {
			width: 20%;
			height: 88rpx;
			text-align: right;
			box-sizing: border-box;
			padding-right: 28rpx;
			display: flex;
			align-items: center;
			justify-content: flex-end;
		}
	}
</style>